<template>
  <view class="uploadContainer">
    <l-file ref="lFile" @up-success="onSuccess"></l-file>
    <view class="uploadForm">
      <uni-easyinput type="number" placeholder="请输入您的授权码" v-model="inputNumber"></uni-easyinput>
      <button @tap="onUpload">文件上传</button>
    </view>
  </view>
</template>

<script>
  export default {
    onShow() {
      this.inputNumber = ''
    },
    data() {
      return {
        localPath: '',
        // 授权码绑定的数据
        inputNumber: '',
      }
    },
    methods: {
      /* 上传 */
      onUpload() {
        console.log(this.inputNumber);
        // 授权码没有输入返回提示信息
        if(this.inputNumber == ''){
          uni.showToast({
            icon:'none',
            title: '请输入授权码'
          })
          return;
        }
        /**
         * url：上传接口地址
         * name：附件key,服务端根据key值获取文件流，默认file,上传文件的key
         * header: 上传接口请求头
         */
        this.$refs.lFile.upload({
          //替换为你的上传接口地址
          // url: 'http://192.168.0.116:3800/api/upload',
          url:'http://172.20.10.9:3800/api/upload',
          // 服务端接收附件的key
          name: 'file',
          // 将授权作为参数传输
          'authorizationCode': this.inputNumber,
        });
      },
      onSuccess(res) {
        console.log('上传成功回调', JSON.stringify(res));
        // 根据前端返回的状态码做出不同的设置
        if(res.data.code == 401) {
          // 授权码验证失败
          uni.showToast({
            title: res.data.message,
            icon:'error',
          })
        }else if(res.data.code == 402) {
          uni.showToast({
            title: res.data.message,
            icon:'error'
          })
        }else if(res.data.code == 403) {
          uni.showToast({
            title: '上传文件失败',
            icon: 'error'
          })
        }else if(res.data.code == 200) {
          uni.showToast({
            title: "上传成功",
            icon: 'none'
          })
        }
      },
    }
  }
</script>

<style>
  .uploadContainer {
    padding: 30rpx;
  }
  .uploadForm {
    margin-top: 500rpx;
  }
  .uploadForm button {
    
    margin-top: 30rpx;
  }
</style>
